---
title: Espace de travail expérimental dans Chrome DevTools
sidebar:
  label: Espace de travail dans Chrome DevTools
i18nReady: true
---

import Since from '~/components/Since.astro';
import { Steps } from '@astrojs/starlight/components';


<p>

**Type :** `boolean`<br />
**Par défaut :** `false`<br />
<Since v="5.13.0" />
</p>

Active l'[intégration expérimentale d'un espace de travail dans Chrome DevTools](https://developer.chrome.com/docs/devtools/workspaces) pour le serveur de développement Astro.

Cette fonctionnalité vous permet de modifier des fichiers directement dans Chrome DevTools et de répercuter ces modifications dans votre système de fichiers local via un dossier d'espace de travail connecté. Ceci est utile pour appliquer des modifications, comme l'ajustement des valeurs CSS, sans quitter l'onglet de votre navigateur.

Avec cette fonctionnalité activée, l'exécution de `astro dev` configurera automatiquement un espace de travail dans Chrome DevTools pour votre projet. Ce dernier apparaîtra alors comme une [source d'espace de travail disponible à laquelle vous pouvez vous connecter](#connecter-votre-projet). Les modifications apportées dans le panneau « Sources » seront alors automatiquement enregistrées dans le code source de votre projet.

Pour activer cette fonctionnalité, ajoutez l'option expérimentale `chromeDevtoolsWorkspace` à votre configuration Astro :

```js title="astro.config.mjs" ins={4-6}
import { defineConfig } from 'astro/config';

export default defineConfig({
  experimental: {
    chromeDevtoolsWorkspace: true,
  },
});
```

## Connecter votre projet

Astro créera le fichier de configuration nécessaire à la prise en charge des espaces de travail dans Chrome DevTools. Cependant, votre projet doit également être [connecté en tant que source](https://developer.chrome.com/docs/devtools/workspaces#manual-connection) pour permettre l'enregistrement des fichiers.

<Steps>

1. [Démarrez le serveur de développement d'Astro](/fr/develop-and-build/#démarrer-le-serveur-de-développement-dastro) avec la commande CLI appropriée pour votre gestionnaire de paquets.

2. Accédez à l'aperçu de votre site (par exemple `http://localhost:4321/`) dans Chrome et ouvrez DevTools.

3. Sous l'onglet **Sources** > **Espace de travail**, vous trouverez le dossier de votre projet Astro. Cliquez sur **Connecter** pour ajouter votre répertoire comme espace de travail.

</Steps>

Consultez la [documentation des espaces de travail dans Chrome DevTools](https://developer.chrome.com/docs/devtools/workspaces#connect) pour plus d'informations.
